<!--申请退款-->
<template>
  <div>
    <van-nav-bar title="申请退款" left-arrow @click-left="closeWin" :border="false">
      <van-icon name="arrow-left" slot="left" color="#000" size="20" />
    </van-nav-bar>
    <div class="top">
        <div style="margin-top:4px;">
            <img src="../../../../../static/img/warn.png" alt="" style="width:13px;height:13px"/>
        </div>
        <div class="text"> 您拒绝后，买家可以要求集市介入处理。如果集市核实是您的责任，将影响您的纠纷退款率</div>
    </div>
    <part9  @func="getMsgFormSon" @func1="getMsgFormSon1"></part9>
    <!-- <part4></part4> -->
    <div style="padding:20px">
    <div  class="title" style="margin-bottom:10px;">上传凭证<span style="font-size:12px;color:#e5e5e5e;">(最多6张)</span></div>
    <div class="imgList">
      <div v-for="(item,index) in imgList" class="imgContain" :key="index">
        <div class="clear" @click="delImg(index)">
          <img src="../../../../../static/img/lanhu/43.png" alt style="width: 13px;height: 13px;" />
        </div>
        <img :src="item" alt="" />
      </div>

      <div v-if="imgList.length < 6" @click="getImgUrl(imgList.length,6)" class="imgContain">
        <img src="../../../../../static/img/lanhu/87.png" alt="" />
      </div>
    </div>
  </div>

    <div class="btn" @click="refuse">拒绝申请</div>
  </div>
</template>

<script>
import part9 from "_c/markets/refund/part9.vue";
import part2 from "_c/markets/refund/part2.vue";
import part3 from "_c/markets/refund/part3.vue";
import part4 from "_c/markets/refund/part4.vue";
import part5 from "_c/markets/refund/part5.vue";
import { getFun, getTimer } from "@/api/publicFun.js";
let publicFun = getFun();
export default {
  name: "orderDetail",
  components: {
    part9,
    part2,
    part3,
    part4,
    part5
  },
  data() {
    return {
      adminRefundNote: "",
      adminRefuseReason: "",
      refundId: "",
      refundImage: "", //图片
      imgList: [], // 用于绑定已上传的图片数组（组件内部使用，在删除图片时用到）
      userId:'',
      ordersId:'',
      refundId:'',
      goodsState:'',
      detailList:[],
      url1: this.$api+'/marketorderservice/api/v1/market/refund/log/list',
    };
  },
  methods: {
    getMsgFormSon(data) {
      this.adminRefuseReason = data;
    },
    getMsgFormSon1(data) {
      this.adminRefundNote = data;
    },
    //初始化获取信息
    // getInfo() {
    //   let that = this;
    //   let params = {
    //     refundId: this.refundId,
    //     userId: this.userId
    //   };
    //   this.$Axios.Post(this.url1, params).then(function(res) {
    //     that.detailList = res.data.refundRVo.refund;
    //     that.goodsState = res.data.refundRVo.refund.goodsState;
    //     console.log(that.goodsState+"两种退款状态")
    //   });
    // },
    // 获取图片地址后的回调
    callJSGetImgUrl(str) {
      this.imgList = this.imgList.concat(str.split(","));
      this.refundImage = this.imgList.join();
    },
    // 删除图片
    delImg(index) {
      this.imgList.splice(index, 1);
      this.refundImage = this.imgList.join();
    },
    refuse(){
      if(this.adminRefuseReason==''){
        this.$toast("请选择拒绝原因！")
      }else if(this.adminRefundNote==''){
        this.$toast("请填写拒绝说明！")
      }else{   
        let that = this;
        let url =  this.$api+'/marketorderservice/api/v1/market/refund/refuse';
        let params = {
          adminRefundNote: that.adminRefundNote,
          adminRefuseReason: that.adminRefuseReason,
          refundId: that.refundId,
          refundImage: that.refundImage
        };
        this.$Axios.Post(url, params).then(function(res) {
          if(res.data){
            if(res.data.flag){
              that.$toast("拒绝退款成功！")
              // let arg='[{"userId":"'+that.userId+'"},{"ordersId":"'+that.ordersId+'"},{"refundId":"'+that.refundId+'"}]' 
              // that.link('/market/orders/details',arg)
              that.closeWin();
            }
          }else{
            that.$toast(res.messageList[0].message)
          }
        });
      }  
    }
  },
  mixins: [publicFun], //混入
  mounted() {
    this.userId = this.$router.currentRoute.query.userId;
    this.ordersId = this.$router.currentRoute.query.ordersId;
    this.refundId = this.$router.currentRoute.query.refundId;
    // this.getInfo();
    window.callJsGetLocation = this.callJsGetLocation; // 挂载获取地址回调方法
    window.callJSGetImgUrl = this.callJSGetImgUrl; // 挂载获取图片回调方法
  }
};
</script>

<style scoped="">
.top {
  padding: 13px 15px;
  border-top: 1px solid #e5e5e5;
  /* border-bottom: 1px solid #e5e5e5; */
  display: flex;
}
.text {
  color: #333333;
  font-size: 12px;
  line-height: 20px;
  text-indent:5px;
}
.btn {
  width: 100%;
  height: 40px;
  font-size: 16px;
  text-align: center;
  line-height: 40px;
  background-color: #ffd630;
  position: fixed;
  bottom: 0;
  z-index: 2000;
}
.imgList:after{content:"";display:block;clear:both;}
.imgList .imgContain{float: left;margin-right: 3%;width:23.5%;margin-bottom: 10px;position: relative;}
.imgList .imgContain img{width: 100%;height: 80px;}
.imgList .imgContain:nth-child(3n){margin-right: 0;}
.clear{position: absolute;right: -6px;top: -6px;z-index: 100;}
</style>